<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="/js/elementui/index.css">
</head>
<body>
<div id="app">
    <div class="demo-input-suffix">
        <el-row :gutter="20">
            <el-col :span="8">
                <el-input
                    size="small"
                    placeholder="请输入激光码"
                    prefix-icon="el-icon-search"
                    v-model="input1"

            >
            </el-input>
            </el-col>
            <el-col :span="6"> <el-button type="primary" @click="showProductByLaserCode" >查询</el-button></el-col>
        </el-row>

    </div>
    <el-dialog
            title="激光码信息"
            :visible.sync="laserDialogVisible"
            width="60%"
            center>
        <el-row :gutter="20">
            <el-col :span="8"> <span>您好</span></el-col>
            <el-col :span="6"> <span>产品型号：{{product.pkind}}</span></el-col>
            <el-col :span="6"> <span>产品编码：{{product.pnumber}}</span></el-col>
        </el-row>
        <el-row :gutter="20">
            <el-col :span="8"> <span>生产地址：{{product.pline}}</span></el-col>
            <el-col :span="6"> <span>流水：{{product.number*product.price}}</span></el-col>
            <el-col :span="6"> <span>重量：{{product.quality}}</span></el-col>
        </el-row>



        <span slot="footer" class="dialog-footer">
    <el-button type="primary" @click="laserDialogVisible = false">返回</el-button>
  </span>
    </el-dialog>

</div>

<script src="/js/axios/axios.min.js"></script>
<script src="/js/vue/vue.js"></script>
<script src="/js/elementui/index.js"></script>
<script>
    new Vue({
        el:"#app",
       data(){
           return{
               product:{
                    pkind:'',
                    pnumber:'',
                    tpid:'',
                    pline:'',
                    number:'',
                    price:'',
                    quality:''
               },
               input1:'',
                laserDialogVisible:false
           }
       } ,
        methods:{
            showProductByLaserCode(){
                axios.get("/antifake?code="+this.input1).then(value=>{
                    if(value.data.code==1){
                        this.product=value.data.data;
                }
                });
                this.laserDialogVisible=true
            }
        }
    });
</script>
</body>
</html>